<html>

	<head>
		<meta charset="UTF-8">
		<title>浮动广告</title>
		<script src="js/jquery-2.0.3.js"></script>
		<body>
			<div id="floatPhoto" style="position:absolute">
					<img src="aaa.gif" >
			</div>

			<script>
				var x = 0,
					y = 0
				var xin = true,
					yin = true
				var step = 1
				var obj = document.getElementById("floatPhoto")

				function float() {
					var L = T = 0
					//R：body宽度除去div宽度之后剩余的宽度
					var R = document.body.clientWidth - obj.offsetWidth
					//B：body高度除去div高度后剩余的高度
					var B = document.body.clientHeight - obj.offsetHeight
						//让广告动起来
					obj.style.left = x + document.body.scrollLeft
					obj.style.top = y + document.body.scrollTop

					x = x + step * (xin ? 1 : -1)//判断是否改变方向
					if(x < L) {
						xin = true;
						x = L
					}
					if(x > R) {
						xin = false;
						x = R
					}
					y = y + step * (yin ? 1 : -1)//判断是否改变方向
					if(y < T) {
						yin = true;
						y = T
					}
					if(y > B) {
						yin = false;
						y = B
					}
					
				}
				var itl = setInterval("float()", 10)
				//鼠标放上的时候清除函数停止
				obj.onmouseover = function() {
					clearInterval(itl)
				}
				obj.onmouseout = function() {
					//鼠标离开继续执行函数
					itl = setInterval("float()", 10)
				}
			</script>
		</body>

</html>